<script setup>
import ShopInfo from '@/components/Home/ShopInfo.vue';
import {useShopInfoStore} from '@/stores/shop'
import {useRouter} from "vue-router";

const router = useRouter();
const showShop = (id) => {
  router.push({
    name: 'shop',
    params: {
      id: id
    }
  })
}
</script>

<template>
  <!-- 附近店铺 -->
  <div class="nearby">
    <h3 class="nearby_title">附近店铺</h3>
    <a v-for="(item, index) in useShopInfoStore().nearbyList" @click="showShop(item.id)">
      <ShopInfo :shopInfo="item" :key="index"/>
    </a>
  </div>
</template>

<style lang="scss" scoped>
@import '@/style/viriables.scss';

.nearby {
  &_title {
    margin: .16rem 0;
    font-size: .18rem;
    font-family: PingFangSC-Medium;
    font-weight: normal;
    line-height: .25rem;
    color: $content_fontcolor;
  }

  a {
    text-decoration: none;
  }
}
</style>